/*!
 * Ext JS Library 3.3.1
 * Copyright(c) 2006-2010 Sencha Inc.
 * licensing@sencha.com
 * http://www.sencha.com/license
 */
// Application instance for showing user-feedback messages.
//var App = new Ext.App({});
var fm = Ext.form;

var total_row = 10;
var proxy = new Ext.data.ScriptTagProxy({
 	api: {
        read : Controller+'/readmedia'
        //create : Controller+'/create',
        //update: Controller+'/create',
        //destroy: Controller+'/delete'
    }
});
// The new DataWriter component.
var writer = new Ext.data.JsonWriter({
    encode: true   // <-- don't return encoded JSON -- causes Ext.Ajax#request to send data using jsonData config rather than HTTP params
});

// Typical Store collecting the Proxy, Reader and Writer together.
var store = new Ext.data.JsonStore({
	start : 'start',
	remoteSort: true,
    totalProperty: 'total',
    proxy: proxy,
    root: 'data',
    fields : [
              {name: 'clip_id',type: 'int'},
              {name: 'clip_title',type: 'string'},
              {name: 'edit',type: 'string'}
          ],
	  listeners: {
	      save: function(s, b, d) {
	    	  store.save();
	      }
	  },     
    writer: writer    // <-- plug a DataWriter into the store just as you would a Reader
});

// load the store immeditately
//store.load();

var filters = new Ext.ux.grid.GridFilters({
    // encode and local configuration options defined previously for easier reuse
    encode: true, // json encode the filter query
    local: true,   // defaults to false (remote filtering)
    filters: [{
        type: 'numeric',
        dataIndex: 'clip_id'
    }, {
        type: 'string',
        dataIndex: 'clip_title'
    }]
});
var createColModel = function (finish, start) {

    var columns = [{header: "ID", 
                	width: 15,
    				resizable:true,
                	sortable: true,
                	sort: 'clip_id',
                	dataIndex: 'clip_id'
                },{
                	header: "Tiêu Đề", 
                	width: 100, 
                	sortable: true, 
                	sort: 'clip_title',
                	dataIndex: 'clip_title' 
                },{
                	header: "Sửa", 
                	width: 100, 
                	sortable: false,
                	renderer: renderedit,
                	dataIndex: 'clip_id'
                },{
                	header: "Xóa", 
                	width: 100, 
                	sortable: false,
                	renderer: renderdelete,
                	dataIndex: 'clip_id'
                }
               ];

    return new Ext.grid.ColumnModel({
        columns: columns.slice(start || 0, finish),
        defaults: {
            sortable: true
        }
    });
};

Ext.onReady(function() {
    Ext.QuickTips.init();

    // use RowEditor for editing
    var editor = new Ext.ux.grid.RowEditor({
        saveText: 'Update'
    });
    // Create a typical GridPanel with RowEditor plugin
    var newsGrid = new Ext.grid.GridPanel({
        renderTo: 'all_list',
        iconCls: 'icon-grid',
        frame: true,
        title: 'Danh Sách',
        height: 300,
        store: store,
        plugins: [editor,filters],
        colModel: createColModel(11),
        listeners: {
            render: {
                fn: function(){
                    store.load({
                        params: {
                            start: 0,
                            limit: total_row
                        }
                    });
                }
            }
        },
        tbar: [],
        bbar: new Ext.PagingToolbar({
            store: store,
            pageSize: total_row,
            plugins: [filters]
        }),
        viewConfig: {
            forceFit: true
        }

    });

    /**
     * onAdd
     */
    function onAdd(btn, ev) {
        var u = new newsGrid.store.recordType({
        	title: '',
        	date: ''
        	
        });
        editor.stopEditing();
        newsGrid.store.insert(0, u);
        editor.startEditing(0);
    }
    /**
     * onDelete
     */
    function onDelete() {
        var recs = newsGrid.getSelectionModel().getSelections() ;
        if (!recs) {
            return false;
        }
        for(var i in recs)
        {
        	newsGrid.store.remove(recs[i]);
        }
    }
    //store.on();

});
function formatDate(value){
    return value ? value.dateFormat('d-m-Y') : '';
}
function renderedit(value){
	return "<a href='"+Controller+"/updatemedia/lang/vi/id/"+value+"'>Sửa</a>";
}
function renderdelete(value){
	return "<a href='"+Controller+"/deletemedia/id/"+value+"'>Xóa</a>";
}
